import React, { useState } from 'react';
import classNames from 'classnames';
import styles from './index.module.scss'
import { CheckOutlined } from '@ant-design/icons'

const CheckButton = (props) => {
  // const [isSelected, setSelected] = useState(false);
  const { disabled, children, value } = props
  const handleClick = () => {
    if (disabled) return
    // props.onClick(props.index, !isSelected);
    props.onClick(props.index);
    // setSelected(!isSelected);
  };

  return (
    <div
      className={classNames(styles.default, {
        [styles.selected]: value[props.index],
        [styles.disabled]: disabled,
      })}
      onClick={handleClick}
    >
      {value[props.index]&&<CheckOutlined className={styles.icon }/>}
      <>{children}</>
    </div>
  );
};

export default CheckButton